
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>管理员列表</title>
    <link rel="stylesheet" href="./static/common/layui/css/layui.css">
    <link rel="stylesheet" href="./static/admin/css/style.css">
    <script src="./static/common/layui/layui.js"></script>
    <script src="./static/common/jquery-3.3.1.min.js"></script>
    <script src="./static/common/vue.min.js"></script>
</head>
<body>
<div id="app">
    <!--顶栏-->
    <header>
        <h1 v-text="webname"></h1>
        <div class="breadcrumb">
            <ul>
                <li v-for="vo in address">
                    <a  v-text="vo.name" :href="vo.url" ></a> <span>/</span>
                </li>
            </ul>
        </div>
    </header>

    <div class="main" id="app">
        <!--左栏-->
        <div class="left">
            <ul class="cl" >
                <!--顶级分类-->
                <li v-for="vo,index in menu" :class="{hidden:vo.hidden}">
                    <a href="javascript:;"  :class="{active:vo.active}"  @click="onActive(index)">
                        <i class="layui-icon" v-html="vo.icon"></i>
                        <span v-text="vo.name"></span>
                        <i class="layui-icon arrow" v-show="vo.url.length==0">&#xe61a;</i> <i v-show="vo.active" class="layui-icon active">&#xe623;</i>
                    </a>
                    <!--子级分类-->
                    <div v-for="vo2,index2 in vo.list">
                        <a href="javascript:;" :class="{active:vo2.active}" @click="onActive(index,index2)" v-text="vo2.name"></a>
                        <i v-show="vo2.active" class="layui-icon active">&#xe623;</i>
                    </div>
                </li>
            </ul>
        </div>
        <!--右侧-->
        <div class="right">


            <div class="layui-row">

                <div  class="layui-col-lg4" style="text-align: left">

<!--                    <div class="layui-input-inline" style="width: 300px">-->
<!--                        <input type="text" name="k" value="" placeholder="手机/用户名/邮箱/昵称" class="layui-input key">-->
<!--                    </div>-->
<!--                    <button type="button" class="layui-btn sou">搜索</button>-->
                </div>
            </div>
            <table id="admin_list" lay-filter="admin_list">

            </table>

        </div>
    </div>
</div>
<script type="text/html" id="editAdmin">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="./static/admin/js/config.js"></script>
<script src="./static/admin/js/script.js"></script>
<script>
    layui.use('table', function(){
        var table = layui.table;

        //监听工具条
        table.on('tool(admin_list)', function(obj){
            var data = obj.data;
            if(obj.event === 'del'){
                layer.confirm('真的删除管理员吗', function(index){
                    $.ajax({
                        url:"/watchsystem/admin/delete",
                        method:'post',
                        data:{
                            "id":data.id
                        },
                        success:function (obj) {
                            var data = obj
                            console.log(data)
                            if(data.code == 200){
                                layer.msg(data.msg)
                                layer.close(index);
                                table.reload('admin_list',{
                                    url:"/watchsystem/admin/page",
                                    where:{}
                                })
                            }
                        }
                    })

                });
            }
        });

        //第一个实例
        table.render({
            elem: '#admin_list'
            ,height: 312
            ,url: '/watchsystem/admin/page' //数据接口
            ,method:'post'
            ,page: true //开启分页
            ,cols: [[ //表头
                {field: 'id', title: 'ID',  sort: true, fixed: 'left'}
                ,{field: 'account', title: '用户名'}
                ,{field: 'password', title: '密码', sort: true}
                ,{fixed: 'right', width:178, align:'center', toolbar: '#editAdmin'}

            ]]
        });



    });

</script>

</body>
</html>
